<template>
    <section class="content">
        <Panel :expandable="false" :expand="true">
            <template slot="title">预审查询</template>
            <template slot="body">
                <el-form label-width="100px">
                    <el-row>
                          <el-col :span="6">
                            <el-input v-model="applyName" placeholder="请输入内容">
                              <el-select v-model="applyType" slot="prepend" placeholder="请选择" style="width: 110px;">
                                <el-option label="申请编号" value="1"></el-option>
                                <el-option label="申请名称" value="2"></el-option>
                                <el-option label="订单编号" value="3"></el-option>
                              </el-select>
                            </el-input>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="申请日期">
                               <el-date-picker
                                    v-model="applyDate"
                                    type="date"
                                    value-format="yyyy-MM-dd"
                                    placeholder="选择日期"
                                    class="full-cell"
                                    >
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                      <el-col :span="4">
                        <el-form-item label="预审状态">
                          <el-select v-model="status" class="full-cell">
                            <el-option label="全部" value="-1"></el-option>
                            <el-option label="疑点" value="1"></el-option>
                            <el-option label="通过" value="0"></el-option>
                            <el-option label="审核失败" value="3"></el-option>
                            <el-option label="异常" value="2"></el-option>
                            <el-option label="人工审核处理中" value="4"></el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
                        <el-col :span="6" style="margin-left: 12px">
                            <el-button type="success" @click="handleSearch">搜索</el-button>
                            <el-button type="primary" @click="handleAdd">预审申请</el-button>
                            <el-button type="primary" @click="handleApply">状态查询</el-button>
                        </el-col>
                    </el-row>
                </el-form>
            </template>
        </Panel>

        <Panel :expandable="false" :hasTitle="false" :expand="true">
            <template slot="title"></template>
            <template slot="body">
                <el-table :data="list" header-row-class-name="header-class">
                    <el-table-column prop="applyNo" label="申请编号" align="center">
                    </el-table-column>
                    <el-table-column prop="applyName" label="申请名称" align="center">
                    </el-table-column>
                    <el-table-column prop="vendorId" label="供应商编号" align="center">
                    </el-table-column>
                    <el-table-column prop="createTime" label="申请日期" align="center">
                    </el-table-column>
                    <el-table-column prop="orderNo" label="订单编号" align="center">
                    </el-table-column>
                    <el-table-column prop="msg" label="提交状态" align="center">
                    </el-table-column>
                    <el-table-column label="预审状态" align="center">
                        <template slot-scope="scope">
                           {{scope.row.statusStr}}
                            <!--{{scope.row.statusStr}} <el-button v-if="scope.row.isMatch==1&&scope.row.status==1" @click="handleZB(scope.row)" style="margin-left: 4px" size="mini" type="primary">人工甄别</el-button>-->
                        </template>
                    </el-table-column>
                </el-table>

                <div class="clear-fix">
                    <el-pagination
                        style="float: right; margin-top: 20px;"
                        background
                        layout="total, prev, pager, next"
                        @current-change="handleCurrentChange"
                        :current-page="searchParam.page"
                        :total="searchParam.total">
                    </el-pagination>
                </div>
            </template>
        </Panel>

        <el-dialog title="预审申请" :visible.sync="visible" width="1300px">
            <Preaudit v-if="visible" @commited="handleCommited"></Preaudit>
            <div slot="footer" class="dialog-footer">
                <el-button @click="visible = false">关闭</el-button>
            </div>
        </el-dialog>

        <el-dialog title="" :visible.sync="visibleApply" width="560px">
          <Apply v-if="visibleApply" @commited="statusQuery"></Apply>
          <!--<div slot="footer" class="dialog-footer">-->
            <!--<el-button @click="visibleApply = false">关闭</el-button>-->
          <!--</div>-->
        </el-dialog>
    </section>
</template>
<script>
import Panel from '@/components/common/panel'
import instance from '@/api/index.js'
import apiUrls from '@/js/common/apiUrls'
import Preaudit from './preaudit'
import Apply from './apply'
import {datetimeType, datetimeValueFormat} from '@/js/util'

export default {
    name: 'blackList',
    data() {
        return {
            // totalAmount: 0,
            searchParam: {
                page: 1,
                rows: 10,
                total: 0
            },
            applyName: "", // 申请名称
            applyDate: "", // 申请日期
            list: [],
            applyType: '1',
            status: '-1',
            visible: false,
            visibleApply: false
        }
    },
    components: {
        Panel,
        Preaudit,
        Apply
    },

    methods: {
        getList() {
            let self = this;
            let applyNo = null;
            let applyName = null;
            let orderNo = null;
            let status = null;
            if(self.status != '-1'){
              status = self.status;
            }

            if(self.applyType === '1'){
              applyNo = self.applyName;
            }else if(self.applyType === '2'){
              applyName = self.applyName;
            } else {
              orderNo = self.applyName;
            }
            let param = Object.assign({
                page: this.searchParam.page,
                rows: this.searchParam.rows,
                applyNo: applyNo || null,
                applyName: applyName || null,
                orderNo: orderNo || null,
                applyTime: this.applyDate || null,
                status,
            });

            instance({
                method: 'post',
                url: apiUrls.receive.preauditList,
                params: param
            }).then(function (data) {
                if(data.data.success){
                    // 0:未命中；1：疑似命中；2：异常 3：命中
                    /**
                     * 0、 未命中 -> 通过
                        1、疑似命中  -> 疑点
                        2、异常
                        3、命中  -> 审核失败
                        3、人工审核处理中
                     */
                    let statuses = ['通过', '疑点', '异常', '审核失败', '人工审核处理中'];
                    self.list = data.data.data.list.map((item)=>{
                        item.statusStr = statuses[item.status] || '';

                        return item;
                    });
                    self.searchParam.total = data.data.data.total;
                }
            }).catch(function (err) {
                console.log(err)
            })
        },

        // 查询
        handleSearch() {
            this.searchParam.page = 1;
            this.getList();
        },

        // 预审弹框
        handleAdd() {
            this.visible = true;
        },

        handleApply() {
          this.visibleApply = true;
        },

        handleCurrentChange(pageIndex) {
            this.searchParam.page = pageIndex;
            // this.handleSearch();
            this.getList();
        },

        // 提交完成
        handleCommited(msg) {
          this.visible = false;
          if(msg === false) {
            // do nothing
          } else {
            this.$message.success(msg || "操作成功！");
          }
          this.handleSearch();
        },
        statusQuery(msg) {
          this.visibleApply = false;
          if(msg === false) {
            // do nothing
          } else {
            this.$message.success(msg || "操作成功！");
          }
          this.handleSearch();
        },
        handleZB(item) {
            let self = this;
            instance({
                method: 'post',
                url: apiUrls.receive.zb,
                params: {
                    applyNo: item.applyNo
                }
            }).then(function (data) {
                if(data.data.success){
                    self.getList();
                }
            }).catch(function (err) {
                console.log(err)
            })
        }
    },

    created() {
        this.handleSearch();
    }
}
</script>
<style scoped>
.el-date-editor {
    width: 100%;
}
</style>
